import React from 'react';
import { connect } from 'dva';
import { TabBar, Icon } from 'antd-mobile';
import { routerRedux } from 'dva/router';
import defaultImage from '../../../assets/avatar.jpg';
// import styles from './common.css';

import Search from './pages/search/search';
import PictureCarousel from './pages/pictureCarousel/pictureCarousel';
import CategoryNav from './pages/categoryNav/categoryNav';
import PartTimeList from './pages/partTimeList/PartTimeList';
import token from '../../../framework/utils/token';

const ad1 = require('../../../icons/ad/ad-1.png');
const ad2 = require('../../../icons/ad/ad-2.jpg');

const adList = [{id:1,ad:ad1},{id:2,ad:ad2}]

function JobList({ dispatch, loading, partTimeList }) {

  const { jobArr } = partTimeList
  const adProps ={
    list:adList,
  }

  const partTimeListProps = {
    list: jobList,
    onViewMember(id){
      dispatch(routerRedux.push({
        pathname: '/part-time-detail',
        query: {
          id,
        }
      }));
    },
    onPagination() {
      // if (loading || JSON.stringify(list) == "[]") {
      //   return;
      // }
      return
      if (pageNum >= pages) {
        return;
      }
      dispatch({
        type: 'members/query',
        payload: {
          pageNum: pageNum + 1,
        }
      })
    }
  }

  const MarginHeight = () => <div style={{height: '0.6em', backgroundColor:'#F2F2F2'}}></div>;
  const CutLine = () => <div style={{width: '100%', height:'1px', backgroundColor:'#E4E4E4'}}></div>;

  return (
    // <div style={{marginTop:'2.8125em'}}>
    <div>
      <Search/>
      <PictureCarousel {...adProps}/>
      <CategoryNav />
      <MarginHeight/>
      <PartTimeList {...partTimeListProps}/>
    </div>
  )
}

JobList.propTypes = {
};

function mapStateToProps(state, ownProps) {
  return {
    loading: state.loading.global,
    jobList: state.jobList
  }
}
export default connect(mapStateToProps)(JobList);
